Ext.define('Hi.view.dashboard.VMetrics', {
    extend: 'Ext.chart.Chart',    
    width: 800,
    height: 400,
    animate: true,
    axes: [
        {
            type: 'Numeric',
            position: 'left',
            fields: ['VALORMETRICA'],
            label: {
                renderer: Ext.util.Format.numberRenderer('0,0')
            },
            title: 'Porcentaje de aprobación',
            grid: true,
            minimum: 0
        },
        {
            type: 'Category',
            position: 'bottom',
            fields: ['NOMMETRICA'],
            title: 'Pruebas Selección'
        }
    ],
    series: [
        {
            type: 'column',
            axis: 'left',
            highlight: true,
            tips: {
                trackMouse: true,
                width: 180,
                height: 28,
                renderer: function(storeItem, item){
                    this.setTitle(storeItem.get('NOMMETRICA') + ': ' + storeItem.get('VALORMETRICA') + '%');
                }
            },
            label: {
                display: 'insideEnd', 'text-anchor': 'middle',
                field: 'VALORMETRICA',
                renderer: Ext.util.Format.numberRenderer('0'),
                orientation: 'vertical',
                color: '#333'
            },
            xField: 'NOMMETRICA',
            yField: 'VALORMETRICA'
        }
    ]
});